<route lang="json5" type="page">
{
  style: {
    navigationBarTitleText: '提现',
  },
}
</route>
<template>
  <div class="income-page">
    <div class="model">
      <div class="bank-model">
        <div class="label">提现至</div>
        <div class="bank">
          <image class="img" src="https://img.js.design/assets/img/662670b07ce858ff66831829.jpg" />
          <div class="text">工商银行(7557)</div>
          <span class="i-carbon-chevron-right icon"></span>
        </div>
      </div>
    </div>
    <div class="model">
      <div class="price-tip">提现金额</div>

      <div class="price">
        <span>￥</span>
        <wd-input
          v-model="price"
          placeholder="请输入提现金额"
          type="number"
          size="large"
          no-border
          clearable
          custom-input-class="price-input"
        />
      </div>
      <div class="tips">可提现金额 ￥95</div>
      <div class="custom-button button" @click="to('/pages-sub/income/message')">提现</div>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { to } from '@/utils/page'

const price = ref()

// 下拉刷新
onPullDownRefresh(() => {
  uni.stopPullDownRefresh()
})
</script>
<style lang="scss" scoped>
.income-page {
  box-sizing: border-box;
  min-height: 100vh;
  padding: 28rpx 30rpx;
  background-color: var(--bgc4);

  .model {
    padding: 30rpx;
    margin-bottom: 28rpx;
    background-color: #fff;
    border-radius: 30rpx 30rpx 40rpx;
    --wot-input-fs-large: 50rpx;
    --wot-input-cell-padding-large: 24rpx 24rpx 24rpx 0;

    .bank-model {
      display: flex;
      align-items: center;
      font-size: 30rpx;
      color: var(--color1);
      .bank {
        display: flex;
        flex: 1;
        align-items: center;
        justify-content: flex-end;
        width: 0;
        margin-right: -10rpx;
        text-align: right;
        .img {
          width: 54rpx;
          height: 54rpx;
          margin-right: 16rpx;
          border-radius: 30rpx;
        }
        .icon {
          margin-left: 8rpx;
          color: #c2c5cc;
        }
      }
    }

    .price-tip {
      margin: 30rpx 0;
      font-size: 30rpx;
      color: var(--color2);
    }
    .price {
      display: flex;
      align-items: center;
      margin-top: 35rpx;
      margin-bottom: 35rpx;
      font-size: 58rpx;
      color: var(--color1);
    }
    .tips {
      font-size: 27rpx;
      color: var(--color3);
    }

    .button {
      width: 374rpx;
      margin: 60rpx auto 20rpx;
      font-weight: 500;
    }
  }
}
</style>
